import "./SarasaUiSC-Regular.ttf";
import { LineEdit, TextEdit } from "std-widgets.slint";
import {
    ColorInput,
    ColorLableText,
    ColorViewInput,
    ColorLineEdit,
    ColorCheckBox,
    ColorButtonGold,
    ColorButtonOutWheat,
    ColorCloseButton,
    CSVLogo,
    ColorButtonOutWheat,
} from "component/style.slint";

export component App inherits Window {
    default-font-family: "Sarasa Ui SC";
    in-out property <length> window_hight: 192px;
    width: 610px;
    height: self.window_hight;
    icon: @image-url("CSV_SQL.png");
    title: "CSV单元格行合并工具";
    background: #00000000;
    no-frame: true;
    default-font-size: 14px;
    in-out property <int> counter: 0;
    // 文件路径
    in-out property <string> label_file;
    // 去头去尾
    in-out property <string> label_start: lay-start.text;
    in-out property <string> label_end: lay-end.text;

    in-out property <string> label_title;
    in-out property <string> label_out;

    in-out property <int> label_check_color;
    in-out property <color> label_check_color_value;

    callback close_window();
    // 是否按下了鼠标
    property <bool> drag-area-pressed: false;
    // 记录按下的位置
    property <length> drag-area-down-x: 0;
    property <length> drag-area-down-y: 0;
    callback move-window(length, length);

    callback set-filepath();
    callback out-value();
    callback out-save();

    animate height {
        duration: 150ms;
        easing: ease;
    }

    Rectangle {
        width: root.width;
        height: root.height;
        border-radius: 10px;
        border-color: wheat;
        border-width: 1.2px;
        background: @linear-gradient(0deg, #1d1d1d 0%, #202020 100%);
        desk := HorizontalLayout {
            x: 0;
            y: 0;
            height: 30px;
            Rectangle {
                // background: @linear-gradient(90deg, #333333 0%, #474747 100%);
                in-out property <duration> speed: 120ms;
                border-radius: 10px;
                width: root.width;
                height: parent.height;
                area := TouchArea {
                    width: parent.width;
                    height: parent.height;
                    moved => {
                        //根据移动的偏移量，设置窗口位置
                        move-window(self.mouse-x - drag-area-down-x, self.mouse-y - drag-area-down-y);
                    }
                    pointer-event(ev) => {
                        drag-area-pressed = ev.kind == PointerEventKind.down;
                        if (drag-area-pressed) {
                            drag-area-down-x = self.mouse-x;
                            drag-area-down-y = self.mouse-y;
                        }
                    }
                }

                logo := CSVLogo {
                    x: 10px;
                    y: -1px;
                    font-size: 30px;
                    color: area.has-hover ? @linear-gradient(0deg, beige 0%, wheat 100%) : wheat;
                    animate color { duration: parent.speed; }
                }

                title := Text {
                    x: 85px;
                    y: 9px;
                    text: "单元格行合并工具";
                    color: area.has-hover ? @linear-gradient(0deg, beige 0%, wheat 100%) : wheat;
                    font-size: 14px;
                    vertical-alignment: center;
                    animate color { duration: parent.speed; }
                }

                ColorCloseButton {
                    x: root.width - 32px;
                    y: 5px;
                    clicked => {
                        close-window()
                    }
                }
            }
        }

        lay_file := HorizontalLayout {
            y: 40px;
            padding: 10px;
            spacing: 5px;
            height: 40px;
//            in-out property <string> text;
            ColorLableText {
                text: "CSV文件";
                font-color: white;
            }

            file := LineEdit {
                width: 460px;
                height: 32px;
                font-size: 14px;
                text: root.label_file;
                read-only: true;
                edited(str) => {
                    root.label_file = str
                }
            }

            ColorButtonOutWheat {
                text: "打开";
                width: 40px;
                clicked => {
                    set-filepath()
                }
            }
        }

        lay_start := HorizontalLayout {
            y: 90px;
            padding: 10px;
            spacing: 5px;
            height: 40px;
            in-out property <string> text: start.text;
            ColorLableText {
                text: "去头(默认0)";
                font-color: white;
            }

            start := ColorLineEdit {
                width: 200px;
                input-type: number;
                background: white;
            }
        }

        lay_end := HorizontalLayout {
            x: 305px;
            y: 90px;
            padding: 10px;
            spacing: 5px;
            height: 40px;
            in-out property <string> text: end.text;
            ColorLableText {
                text: "去尾(默认0)";
                font-color: white;
            }

            end := ColorLineEdit {
                width: 200px;
                input-type: number;
                background: white;
            }
        }

        HorizontalLayout {
            y: 140px;
            padding: 10px;
            spacing: 45px;
            height: 40px;
            if root.label_out != "":
            ColorButtonOutWheat {
                width: 40px;
                text: "保存";
                clicked => {
                    root.out-save();
                }
            }
        }

        HorizontalLayout {
            x: 85px;
            y: 140px;
            padding: 10px;
            if root.label_title != "输出结果" && root.label_title != "":
            ColorLableText {
                text: "保存至";
                font-color: wheat;
                font-size: 14px;
            }
            if root.label_title != "输出结果" && root.label_title != "":
            LineEdit {
                height: 32px;
                width: 280px;
                text: root.label_title;
                read-only: true;
                font-size: 14px;
            }
        }

        HorizontalLayout {
            x: 490px;
            y: 140px;
            padding: 10px;
            spacing: 10px;
            height: 40px;
            ColorButtonGold {
                width: 100px;
                text: "转换";
                clicked => {
                    root.out-value();
                }
            }
        }

        Rectangle {
            y: 195px;
            width: 360px;
            height: 1px;
            background: @linear-gradient(90deg, #20202080 0%, #8d8d8dcc 50%, #20202080 100%);
        }

        HorizontalLayout {
            y: 150px;
            padding: 10px;
            spacing: 5px;
            // in property <color> color;
            // in-out property <string> text: label-value.text;
            if root.label_title == "输出结果": Text {
                text: root.label_title;
                color: white;
                font-size: 20px;
                horizontal-alignment: center;
                overflow: elide;
                wrap: word-wrap;
            }
        }

        lay_value := HorizontalLayout {
            y: 200px;
            padding: 10px;
            spacing: 5px;
            if root.label_out != "": TextEdit {
                y: 30px;
                height: 170px;
                text: root.label_out;
                read-only: true;
                edited(str) => {
                    root.label_out = str
                }
            }
        }
    }
}
